import { autorun } from 'mobx';
import React, { useEffect, useState} from 'react';
import {useNavigate} from 'react-router-dom';
import store from '../mobx/store';
function Cinemas(props){
    const navigate = useNavigate()
    const [cityName,setcityName] =useState([])
    const [cinemaList,setCinemaList] =useState([])
    useEffect(()=>{
        if(store.list.length==0){
            store.getList()
        }
        var unsubscribe=autorun(()=>{
            console.log(store.list)
            setCinemaList(store.list)
            
        })
        return()=>{
            //取消订阅
            unsubscribe()
        }
    },[])
    return (
        <div>
            
            <ol>
                {
                    cinemaList.map(item=>{
                      return <li key={item.cinemaId}>{item.cinemaId}----{item.name}</li>
                    })
                }
            </ol>
        </div>
    );
}
export default Cinemas